<template>
	<view class="bgf8">
		<!-- zhifushijian -->
		<view class="h108">
			<view class="w343" style="padding-top: 20rpx;background: #23BC7F">
				<view class="fs17"> 等待配送 </view>
			</view>
		</view>
		<!-- xiangqing -->
		<view class="w343" style="height: 182rpx;margin:-90rpx auto;background: #FFFFFF;border-radius: 15rpx;">
			<view class="fs15" style="padding:44rpx 0 0 30rpx;font-weight: 700;color:#000000;">
				<text>李大钊</text>
				<text style="margin-left: 20rpx;">18366711365</text>
			</view>
			<view class="fs13" style="margin-left: 30rpx;margin-top: 16rpx;color:rgba(142,142,142,1)">
				四川省成都市锦江区玉林路某小区A区15栋
			</view>
		</view>
		<!-- 农夫果园(万达店) -->
		<view class="w343" style="background: #FFFFFF;margin-top: 122rpx;">
			<view class="w90 fs14" style="line-height: 90rpx;">
				<h5 style="color: #000000;font-weight: 700;">农夫果园(万达店)</h5>
			</view>
			<view class="w90" style="border-bottom: 1rpx solid rgba(243,243,243,1);">
				<view style="display: flex; margin: 30rpx 0" v-for="item in 2">
					<image src="../../../static/22.png"></image>
					<view style="margin-left: 30rpx;width: 70%;">
						<view class="fs13" style="position: relative;color: #000000;">
							<text>赣南脐橙</text>
							<text style="position: absolute;right: 0;">￥8.8</text>
						</view>
						<text class="Ptc fs11">规格: 2斤</text><br>
						<view style="position: relative;">
							<text class="Ptc fs12">×2</text>
							<text class="SQtuihuo fs12">申请退款</text>
						</view>
						
					</view>
				</view>
			</view>
			<view class="w90 fs12" style="border: 0;">
				<view style="padding: 30rpx 0;">
					<view style="position: relative;line-height: 46rpx;">
						<text style="color: rgba(51,51,51,1);">配送费</text>
						<text class="redrt" style="color: #333333;">0</text>
					</view>
					<view style="position: relative;line-height: 46rpx;">
						<text style="color: rgba(51,51,51,1);">包装费</text>
						<text class="redrt" style="color: #333333;">￥4</text>
					</view>
					<view style="position: relative;line-height: 46rpx;">
						<text style="color: rgba(51,51,51,1);">店铺满减</text>
						<text class="redrt">-￥16</text>
					</view>
				</view>
				<view style="height: 65rpx;position: relative;">
					<view class="fs12" style="position: absolute;right: 8%;color: #000000;">
						<text>小计</text><text>￥</text>
						<text class="fs16" style="font-weight: 700;">58.8</text>
					</view>
				</view>
			</view>
		</view>
		<!-- 订单信息 -->
		<view class="w343 fs14" style=";margin-top: 20rpx;background: #FFFFFF;">
			<view style="padding: 23rpx 34rpx;position: relative;">
				<text style="color:rgba(51,51,51,1);">订单备注</text>
				<text style="position: absolute;right: 8%;color: rgba(153,153,153,1);">不要肥肉哦 </text>
			</view>
			<view style="padding: 0rpx 34rpx;">
				<text style="color:rgba(51,51,51,1);">订单编号</text>
				<text style="position: absolute;right: 12%;color: rgba(153,153,153,1);">1354843454</text>
			</view>
			<view style="padding: 23rpx 34rpx;">
				<text style="color:rgba(51,51,51,1);">创建时间</text>
				<text style="position: absolute;right: 12%;color: rgba(153,153,153,1);">2020-10-15 15:30:42</text>
			</view>
			<view style="padding: 0rpx 34rpx;">
				<text style="color:rgba(51,51,51,1);">付款时间</text>
				<text style="position: absolute;right: 12%;color: rgba(153,153,153,1);">2020-10-15 16:30:42</text>
			</view>
			<view style="padding: 23rpx 34rpx;">
				<text style="color:rgba(51,51,51,1);">支付方式</text>
				<text style="position: absolute;right: 12%;color: rgba(153,153,153,1);">微信支付</text>
			</view>
		</view>
		<view style="height: 38rpx;" class="bgf8"></view>
		<!-- 支付 -->
		<view style="height: 166rpx;background: #FFFFFF;position: relative;">
			<text class="fs12" style="position: absolute;top: 56rpx;right: 42%;color: rgba(152,152,152,1);">删除订单</text>
			<view class="ddzf fs13">
				再次购买
			</view>
		</view>
		<view style="height: 80rpx;"></view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			
		}
	}
</script>

<style>
.h108{
	height: 216rpx;
	background: #23BC7F;
}
.w343{
	width: 686rpx;
	color: #FFFFFF;
	margin: 0 auto;
}
	.w90 {
		width: 90%;
		margin: 0 auto;
		border-bottom: 1px solid #ececec;
	}

	.w90>view>image {
		width: 108rpx;
		height: 108rpx;
	}
.SQtuihuo{
	display: inline-block;
	width: 134rpx;
	height: 44rpx;
	text-align: center;
	line-height: 40rpx;
	border: 1rpx solid #8E8E8E;
	border-radius: 22rpx;
	color: rgba(142,142,142,1);
	position: absolute;
	right: 0;
}
	.redrt {
		color: rgba(255, 67, 67, 1);
		position: absolute;
		right: 8%;
	}
	.Ptc{
		color: rgba(184,184,184,1);
	}
	.ddzf{
		width: 216rpx;
		height: 62rpx;
		line-height: 62rpx;
		text-align: center;
		color: rgba(255,255,255,1);
		border-radius: 15rpx;
		background: linear-gradient(148deg,#2ed993 0%, #20b47a 97%);
		
		position: absolute;
		top: 44rpx;
		right: 8%;
	}
</style>
